import Vue from "vue";
import Vuex from "vuex";
import app from "./modules/app";
import dict from "./modules/dict";
import user from "./modules/user";
import tagsView from "./modules/tagsView";
import permission from "./modules/permission";
import settings from "./modules/settings";
import getters from "./getters";
import echarts from "echarts";

Vue.use(Vuex);

const store = new Vuex.Store({
  modules: {
    app,
    dict,
    user,
    tagsView,
    permission,
    settings,
    charts: {
      namespaced: true,
      state: {
        instances: {},
      },
      mutations: {
        addChartInstance(state, payload) {
          Vue.set(state.instances, payload.id, payload.instance);
        },
        removeChartInstance(state, id) {
          Vue.delete(state.instances, id);
        },
        updateChartOption(state, payload) {
          const chart = state.instances[payload.id];
          if (chartInstance) {
            chart.setOption(payload.option);
          }
        },
      },
      actions: {
        createChart({ commit }, payload) {
          
            console.log("createChart:", payload);
            // const chart = payload.id;
            // console.log("createChart:", chart);
            const instance = echarts.init(document.getElementById(payload.id));
            // const instance = echarts.init(document.getElementById(payload.id));
            instance.setOption(payload.option);
            commit("addChartInstance", { id: payload.id, instance });
          
        },
        destroyChart({ commit }, id) {
          const chart = store.state.charts.instances[id];
          if (chartInstance) {
            chart.dispose();
          }
          commit("removeChartInstance", id);
        },
        updateChart({ commit }, payload) {
          commit("updateChartOption", payload);
        },
      },
    },
    audio: {
      namespaced: true,
      state: {
        audio: null,
        isPlaying: false
      },
      mutations: {
        setAudio(state, audio) {
          state.audio = audio;
          // console.log('创建Audio!!!');
        },
        setIsPlaying(state, isPlaying) {
          state.isPlaying = isPlaying;
        }
      },
      actions: {
        playAudio({ commit }) {
          commit('setIsPlaying', true);
          if (store.state.audio.audio) {
            store.state.audio.audio.play();
          }
        },
        pauseAudio({ commit }) {
          commit('setIsPlaying', false);
          if (store.state.audio.audio) {
            store.state.audio.audio.pause();
          }
        }
      },
      getters: {
        getAudio(state) {
          return state.audio;
        },
        getIsPlaying(state) {
          return state.isPlaying;
        }
      }
    }
  },
  getters,
});

export default store;
